<template>
	<div>
		<!-- 顶部导航栏 -->
		<!-- <topBar v-if="$route.meta.topBar != false" style="position: fixed;top: 0px;width: 100%;z-index: 1000;"></topBar> -->
		<!--end 顶部导航栏 -->
		<router-view v-if="isRouter" />
		<!-- 底部导航栏 -->
		<bottomTabs v-if="$route.meta.bottomTabs == true && isRouter"></bottomTabs>
		<!--end 底部导航栏 -->
		<van-overlay :show="$store.state.loadingShow">
			<div class="loading flex-center">
				<van-loading size="24px" vertical type="spinner" color="#fff">加载中</van-loading>
			</div>
		</van-overlay>
	</div>
</template>
<script>
import bottomTabs from '@/components/global/bottomTabs';
import topBar from '@/components/global/topBar';
import qs from 'qs';
export default {
	name: 'App',
	data() {
		return {
			isRouter: true,
			appid:
				process.env.NODE_ENV == 'test'
					? 'wxbfc4e2623fd6a65f'
					: 'wxbfc4e2623fd6a65f',
		};
	},
	created() {
		console.log(
			'process.env.NODE_ENV',
			process.env.NODE_ENV,
			process.env.VUE_APP_TITLE
		);
		console.log('version', this.$store.state.version);
		console.log('location', window.location);
		this.clearLocalStorage();
		this.login();
		if (process.env.VUE_APP_TITLE !== 'development') {
			// this.jsjdk_wx();
			this.getLocation();
		}
	},
	destroyed() {
		localStorage.clear();
	},
	methods: {
		wxGetUserInfo() {
			//微信获取用户信息
			window.location.href = `https://api.weixin.qq.com/cgi-bin/user/info?access_token=ACCESS_TOKEN&openid=ovkLMv1UW835BqA_BRJzrnJo_xxc&lang=zh_CN`;
		},
		login() {
			// 页面打开登录流程
			// 1 获取wxcode
			// 2 获取openid
			// 3 获取用户信息
			this.$router.onReady(() => {
				//在APP.vue 要在onReady路由方法内 否则获取不到正确地址
				// var openid = localStorage.getItem('openid');
				var openid = null; //每次进来都调openid
				if (!openid) {
					//没有openid
					if (process.env.VUE_APP_TITLE === 'development') {
						this.getInfo();
						// this.getCode();
					} else if (process.env.VUE_APP_TITLE === 'test') {
						this.getCode();
					} else {
						this.getCode();
						// this.getAppid_wx();
					}
				} else {
					this.getInfo();
				}
			});
		},

		clearLocalStorage() {
			//检测关闭浏览器
			var _beforeUnload_time = 0,
				_gap_time = 0;
			//浏览器关闭,则清除localStorage
			window.onunload = function () {
				_gap_time = new Date().getTime() - _beforeUnload_time;

				if (_gap_time <= 5) {
					//浏览器关闭
					localStorage.clear();
				}
			};
			//即将离开当前页面(刷新或关闭)时记录当前时间
			window.onbeforeunload = function () {
				_beforeUnload_time = new Date().getTime();
			};
		},

		//获取微信code
		getCode() {
			// 1 判断地址有没有code
			// 2 无code 保存当前地址携带参数 并跳转微信端获取
			// 有code 将页面本来的参数 带入code回调页面
			let fromurl = encodeURIComponent(
				JSON.parse(JSON.stringify(window.location.href)).split('?')[0]
			);
			console.log('fromurl', fromurl);
			// debugger
			if (this.$route.query.hasOwnProperty('code')) {
				if (JSON.parse(localStorage.getItem('codeUrl'))) {
					//将页面本来的参数 带入code回调页面

					window.location.href =
						window.location.href +
						'&' +
						JSON.parse(
							localStorage.getItem('codeUrl')
						).search.split('?')[1];
					localStorage.removeItem('codeUrl');
					return;
				}
				// this.getOpenid_wx();
				this.checkSubscribe_wx();
			} else {
				//如果code未获取
				if (window.location.search) {
					localStorage.setItem(
						'codeUrl',
						JSON.stringify(window.location)
					);
				}
				// 测试appid wxbfc4e2623fd6a65f
				// 生产appid wxbfc4e2623fd6a65f
				window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${this.appid}&redirect_uri=${fromurl}&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect`;
			}
		},
		//获取用户信息
		getUserinfo() {
			window.location.href = `https://api.weixin.qq.com/sns/userinfo?access_token=54_gW_6o9KABkftyQixIDSzCT9D0j7fA4tCcnSLg7RnYFsxHkVrMM3j8EXwZpjgzfnahJPbvsmKbiTzMkJpgjZvnQ&openid=ovkLMv1UW835BqA_BRJzrnJo_xxc&lang=zh_CN`;
		},

		//获取微信appid
		getAppid_wx() {
			var params = {};
			this.$myApi.getAppid_wx(params).then((res) => {
				this.$dialog.alert({
					title: 'openid',
					message: JSON.stringify(params),
				});
				if (res.code == 0) {
				} else {
				}
			});
		},
		//检查是否关注公众号
		checkSubscribe_wx() {
			var code = this.$route.query.code || '';
			var params = {
				code: code,
			};
			this.$myApi.checkSubscribe_wx(params).then((res) => {
				var query = JSON.parse(JSON.stringify(this.$route.query));
				delete query.code;
				this.$router.replace({ query: query });
				//code调用一次接口后销毁 只能使用一次
				if (res.status == '00000') {
					this.$store.dispatch('SET_OPENID', res.data);
				} else {
				}
			});
		},
		//获取openid
		getOpenid_wx() {
			var code = this.$route.query.code || '';
			var params = {
				wxcode: code,
				appid: this.appid,
			};
			this.$myApi.getOpenid_wx(params).then((res) => {
				var query = JSON.parse(JSON.stringify(this.$route.query));
				delete query.code;
				this.$router.replace({ query: query });
				//code调用一次接口后销毁 只能使用一次
				if (res.code == 0) {
					if (res.data.openid) {
						this.$store.dispatch('SET_OPENID', res.data);

						this.updInfo_member();
					}
				} else {
				}
			});
		},
		//更新用户信息
		updInfo_member() {
			var params = {};
			this.$myApi.updInfo_member(params).then((res) => {
				if (res.code == 0) {
					this.getInfo();
				} else {
				}
			});
		},
		//判断是商户端还是用户端
		getInfo() {
			console.log(this.$route.query);
			if (this.$route.query.role == 'merchant') {
				this.getInfo_vendor();
			} else {
				this.get_member();
			}
		},
		//获取用户信息
		get_member() {
			var params = {};
			this.$myApi.get_member(params).then((res) => {
				if (res.code == 0) {
					this.$store.dispatch('SET_USERINFO', res.result);
					this.addMemeberLog_member(res.result);
				} else {
				}
				this.isRouter = true;
			});
		},
		//客流量
		addMemeberLog_member(result) {
			var params = {
				pkey: result.pkey,
			};
			this.$myApi.addMemeberLog_member(params).then((res) => {
				if (res.code == 0) {
				} else {
				}
				this.isRouter = true;
			});
		},
		//获取商家信息
		getInfo_vendor() {
			var params = {};
			this.$myApi.getInfo_vendor(params).then((res) => {
				if (res.code == 0) {
					var pat = /(\d{3})\d*(\d{4})/;
					res.result.mobile = res.result.mobile.replace(
						pat,
						'$1****$2'
					);
					this.$store.state.vendorInfo = res.result;
					this.$router.replace('/TheVendor/home');
				}
				this.isRouter = true;
			});
		},
	},
	components: {
		bottomTabs,
		topBar,
	},
};
</script>
<style lang="less">
@import url('~@/assets/css/common.css');
@import url('~@/assets/css/variable.less');
@import url('~@/assets/css/components/tableContaner.less');
@import url('~@/assets/css/components/dialog.less');
.loading {
	height: 100vh;
	width: 100vw;
	position: fixed;
}
</style>